import QtQuick 2.15
import QtQuick.Controls 2.15

ApplicationWindow {
	visible: true
	width: 600
	height: 400
	
	Column {
		anchors.centerIn: parent
		spacing: 10
		
		Image {
			id: image
			source: "/resources/img/wheel" // Image loaded successfully
			// source: "" // No image set
			// source: "https://ssssssssss.xxxx" // 此图片过大， Image is loading...
			//source: "/error_path/xxx" // Failed to load the image
			
			clip: true
			// 根据状态显示不同的消息
			onStatusChanged: {
				if (image.status == Image.Ready) {
					console.log("Image loaded successfully")
				} else if (image.status == Image.Loading) {
					console.log("Image is loading...")
				} else if (image.status == Image.Error) {
					console.log("Failed to load the image")
				} else if (image.status == Image.Null) {
					console.log("No image set")
				}
			}
			
			// 显示加载进度（仅在图像正在加载时）
			onProgressChanged: {
				if (image.status == Image.Loading) {
					console.log("Loading progress:", image.progress * 100, "%")
				}
			}
		}
		
		Text {
			width:100
			height:30
			anchors.horizontalCenter:parent.horizontalCenter
			// 根据图像状态显示不同的文本
			text: image.status == Image.Ready ? "Image Loaded" :
					image.status == Image.Loading ? "Loading Image..." :
						image.status == Image.Error ? "Error Loading Image" :
						"No Image Set"
			color: image.status == Image.Error ? "red" : "black"
		}
	}
}
